﻿@model DingTalkAgent.Web.Models.SysN_Page
@{
    ViewBag.Title = "list";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

    <div class="wrapper wrapper-content">
        <div class="row animated fadeInRight">
            <div class="col-sm-3">
                <div class="ibox float-e-margins">
                    <div class="ibox-title">
                        <h5>栏目管理</h5>
                        <div class="ibox-tools">
                            <a class="collapse-link">
                                <i class="fa fa-chevron-up"></i>
                            </a>
                            <a class="close-link">
                                <i class="fa fa-times"></i>
                            </a>
                        </div>
                    </div>
                    <div class="ibox-content">
                        <div id="tree_1"></div>
                    </div>
                </div>
            </div>

            <div class="col-sm-9">
                <div class="ibox float-e-margins">
                    <div class="ibox-title">
                        <h5>导航管理</h5>
                    </div>
                    <div class="ibox-content">
                        <form role="form" class="form-inline" id="form1" name="form1">
                            @Html.Hidden("Parent_ID", -1)
                            <div class="form-group">
                                <label for="exampleInputEmail2" class="sr-only">关键字</label>
                                <input type="text" placeholder="请输入关键字" id="keyword" name="keyword" class="form-control">
                            </div>
                            <button class="btn btn-primary" type="button" onclick="add()">添加</button>
                            <button class="btn btn-white" type="button" id="btnsearch">查询</button>
                        </form>
                    </div>
                    <div class="ibox-content">
                        <div class="jqGrid_wrapper">
                            <table id="table_list_1"></table>
                            <div id="pager_list_1"></div>
                        </div>
                        <p>&nbsp;</p>

                    </div>
                </div>
            </div>
        </div>
    </div>

    <script type="text/javascript">

    $(document).ready(function () {
        $("#btnsearch").click(function () {
            $("#table_list_1").jqGrid('setGridParam', {
                postData: $('#form1').serializeObject(),
                page: 1
            }).trigger("reloadGrid"); //重新载入
        });

        $.jgrid.defaults.styleUI = 'Bootstrap';
        $("#table_list_1").jqGrid({
            url: '/SysBase/SysNList',
            datatype: "json",
            mtype: 'POST',
            height: 'auto',
            autowidth: true,
            shrinkToFit: true,
            multiselect: true,
            multiboxonly: true,
            postData: $('#form1').serializeObject(),
            cellEdit: true,
            rowNum: 10,
            rowList: [10, 20, 30],
            colNames: ['栏目', '关联页面', '编码', 'Alt', '排序编号', '是否启用', '操作'],
            colModel: [
                {
                    name: 'Name',
                    index: 'Name',
                    width: '15%',
                },
                {
                    name: 'PageName',
                    index: 'PageName',
                    width: '15%',
                },
                {
                    name: 'Code',
                    index: 'Code',
                    width: '15%',
                },
                {
                    name: 'Alt',
                    index: 'Alt',
                    width: '15%',
                },
                {
                    name: 'OrderID',
                    index: 'OrderID',
                    width: '15%',
                },
                {
                    name: 'active',
                    index: 'active',
                    width: '15%',
                },
                    {
                        label: '修改', name: 'Nav_ID', index: 'Nav_ID', width: '25%', align: 'center',
                        formatter: function (cellvalue, options, rowObject) {
                            var actionlink1 = "&apos;/SysBase/SysNDelete&apos;";

                            return "<a data-toggle='modal' href='SysNEdit?ID=" + cellvalue + "' data-target='#mmXgmodal'>修改</a> | <a href='#' onclick='javascript:Delete(" + cellvalue + "," + actionlink1 + ")'>删除</a>";
                        },
                    },
            ],
            jsonReader: {
                root: "List",
                page: "page",
                total: "total",
                records: "records",
                repeatitems: false,
            },
            pager: "#pager_list_1",
            viewrecords: true,
            hidegrid: false
        });
        $(window).bind('resize', function () {
            var width = $('.jqGrid_wrapper').width();
            $('#table_list_1').setGridWidth(width);

        });
        $('#mmXgmodal').on('hidden.bs.modal', function () {
            $(this).removeData('bs.modal');
        });
        getTree();
    });

        function getTree() {
            $('#tree_1').jstree({
                'core': {
                    'data': {
                        "url": "/SysBase/SysNGetJsonList",
                        "dataType": "json"
                    }
                },
                "types": {
                    "default": {
                        "icon": "fa fa-file-code-o"
                    },
                    'html': {
                        'icon': 'fa fa-file-text-o'
                    },
                },
                "plugins": ["types", "checkbox", "unique"]
            })
            .on("loaded.jstree", function (event, data) {
                // 展开所有节点
                //$('#tree_1').jstree('open_all');
                // 展开指定节点
                data.instance.open_node(-1);
            })
            .bind('click.jstree', function (event) {
                var eventNodeName = event.target.nodeName;
                var eventNodeId = $(event.target).parents('li').attr('id');
                $("#Parent_ID").val(eventNodeId);
                $("#btnsearch").click();
            })
        }
        function add() {
            $("#mmXgmodal").modal({
                remote: "SysNAdd?id=" + $("#Parent_ID").val()
            });
        }
    </script>
    <div class="modal fade" id="mmXgmodal" tabindex="-1" role="dialog" aria-labelledby="modal">
        <div class="modal-dialog" role="document">
            <div class="modal-content  animated bounceInRight">

            </div>
        </div>
    </div>

